#body {
  >div {
    width: 1000px;
    margin: 0 auto;

    >.list {
      display: flex;
      flex-wrap: wrap;

      >li {
        margin: 0 10px 10px 0;
        width: calc((100% - 2 * 10px) / 3);

        &:nth-child(3n) {
          margin-right: 0;
        }

        >p {
          padding: 5px;
        }

        >div {
          position: relative;
          border-radius: 8px;
          overflow: hidden;

          >img {
            width: 100%;
          }

          >span {
            background-color: rgba(0, 0, 0, 0.3);
            padding: 4px;
            position: absolute;
            color: white;
            font-size: 14px;

            &.hn {
              top: 0;
              right: 0;
            }

            &.nickname {
              left: 0;
              bottom: 0;
            }
          }
        }
      }
    }
  }
}